﻿@inherits TscComponentBase

<AutoHeight AutoStyle="@($"max-height: calc(100vh - 176px);margin-right: -10px;{Style}")">
    <HeaderContent>
        <div class="d-flex mb-3 @HeaderClass" style="@HeaderStyle">
            @HeaderContent
            <ServiceRelation Service="@ConfigurationRecord.Service"
                             Instance="@ConfigurationRecord.Instance"
                             Endpoint="@ConfigurationRecord.Endpoint"
                             ValueChanged="ServiceRelationChanged"
                             ModelType="ConfigurationRecord.ModelType" />
            <MSpacer />
            <SDateTimeRangeToolbar Class="mr-6 my-auto" @bind-DefaultQuickRange="ConfigurationRecord.DefaultQuickRangeKey"
                                  OnUpdate="OnDateTimeUpdateAsync"
                                  ShowInterval ShowQuickChange ShowTimeZoneSelector
                                  OnAutoUpdate="OnAutoDateTimeUpdateAsync" />
            @if (!View)
            {
                <MTooltip Top>
                    <ActivatorContent>
                        <div @attributes="@context.Attrs" @onclick="SwitchEdit" class="@($"my-auto d-flex {(ConfigurationRecord.IsEdit?"mr-6":"mr-1")}")">
                            <MSwitch @key="ConfigurationRecord.IsEdit" Value="ConfigurationRecord.IsEdit" Readonly TValue="bool" LeftText="@I18n.Dashboard("V")" RightText="@I18n.Dashboard("E")" HideDetails="@("auto")" TrackColor="white" Color="primary" Class="my-auto" />
                        </div>
                    </ActivatorContent>
                    <ChildContent>
                        @if (ConfigurationRecord.IsEdit)
                        {
                            <span>@I18n.Dashboard("In edit mode, click to switch to view mode")</span>
                        }
                        else
                        {
                            <span>@I18n.Dashboard("In view mode, click to switch to edit mode")</span>
                        }
                    </ChildContent>
                </MTooltip>
                <SButton Icon Class="mr-3 my-auto" Style="@(ConfigurationRecord.IsEdit ?"":"display:none;")" OnClick="AddPanel">
                    <SIcon Tooltip="@I18n.Dashboard("Add Panel")" Size=28>@IconConstants.Chart</SIcon>
                </SButton>
                <SButton Icon Class="my-auto" Style="@(ConfigurationRecord.IsEdit ?"":"display:none;")" OnClick="SaveAsync">
                    <SIcon Tooltip="@I18n.T("Save")" Size=28>@IconConstants.Save</SIcon>
                </SButton>
            }
        </div>
    </HeaderContent>
    <AutoHeightContent>
        @if (_isLoading)
        {
            <LoadingData />
        }
        <CascadingValue Value="ConfigurationRecord" IsFixed>
            <div id="@_scrollElementId" class="full-height overflow-y">
                @if (ConfigurationRecord.ServiceRelationReady(_serviceRelationReady) && _timeRangeReady)
                {
                    <PanelGrids Panels="ConfigurationRecord.Panels" />
                }
                else if (!ConfigurationRecord.IsEdit)
                {
                    <SEmptyPlaceholder />
                }
            </div>
        </CascadingValue>
    </AutoHeightContent>
</AutoHeight>